{include file="public/head" /}
<body>
{include file="public/menu" /}
<div class="member">
    <div class="wrap">
        {include file="public/left" /}
        <div class="setting">
            <form id="pagemain" action="">
                <div class="head commonTab">
                    <div>
                        <a href="{:url('Member/info')}">个人资料</a>
                        <a href="{:url('Member/safe')}">安全中心</a>
                        <a class="ac" href="{:url('Member/card')}">银行卡</a>
                    </div>

                </div>
                <div class="bottom commonBottom">
                    <p style="box-sizing: border-box;margin: 0;color: rgba(0, 0, 0, 0.65);font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5;
    list-style: none;
    font-feature-settings: 'tnum';
    position: relative;
    padding: 8px 15px 8px 37px;background-color: #fffbe6;margin-bottom: 16px;text-align: center;">尊敬的用户，信用卡功能因政策原因已停用</p>
                    <table cellspacing="0" cellpadding="0" class="commonTable">
                        <tr>
                            <th>银行</th>
                            <th>卡号</th>
                            <th>预留手机</th>
                            <th>添加时间</th>
                            <th>状态</th>
                            <th>操作</th>
                        </tr>
                        {volist name="dataList" id="vo"}
                        <tr>
                            <td>{$vo.bank_name}</td>
                            <td>{$vo.bank_number}</td>
                            <td>{$vo.bank_mobile}</td>
                            <td>{$vo.transDate}</td>
                            <td>{$vo.status}</td>
                            <td><a href="JavaScript:(o)" onclick="ToDel({$vo.id})">移除</a></td>
                        </tr>
                        {/volist}
                        <tr>
                            {if $member.signContract}
                            <td colspan="6"><div class="bj" style="cursor:pointer;color: #999999;font-size:18px;
font-family:SourceHanSansCN-Light;
font-weight:bold;">添加银行卡>></div></td>
                            {else}
                            <td colspan="6"><a href="JavaScript:QianYUe()">《会员电子协议》</a></td>
                            {/if}
                        </tr>
                    </table>
                </div>
            </form>
            <!--点击编辑-->
            <div class="edit">
                <div class="head commonTab">
                    <div>
                        <span class="ac">添加银行卡</span>
                    </div>
                </div>
                <div class="formBox">
                    <form action="" onSubmit="return false" id="FromData">
                        <div class="item">
                            <div class="label"><i>*</i>姓名：</div>
                            <div class="input"><input type="text" name="bank_truename" id="bank_truename" value="{$data.username}" readonly></div>
                        </div>
                        <div class="item">
                            <div class="label"><i>*</i>证件号：</div>
                            <div class="input"><input type="text" name="card" value="{$data.certificate}" readonly></div>
                        </div>
                        <div class="item">
                            <div class="label"><i>*</i>类型：</div>
                            <select name="cardType" id="cardType" onchange="Sour(this)" style="width: 300px;height: 40px">
                                <option value="1">储蓄卡</option>
                                <!--<option value="2">信用卡</option>-->
                            </select>
                        </div>
                        <div class="item">
                            <div class="label"><i>*</i>银行卡号：</div>
                            <div class="input"><input type="text" id="bank_number" name="bank_number" value=""></div>
                        </div>
                        <div class="item xykinfo">
                            <div class="label"><i>*</i>有效期：</div>
                            <div class="input"><input type="text" id="validate" placeholder="格式为月年 如 0123" name="validate" value=""></div>
                        </div>
                        <div class="item xykinfo">
                            <div class="label"><i>*</i>CVV2：</div>
                            <div class="input"><input type="text" id="cvv2" name="cvv2" value=""></div>
                        </div>
                        <div class="item">
                            <div class="label"><i>*</i>预留手机号：</div>
                            <div class="input"><input type="text" id="bank_mobile" name="bank_mobile" value=""></div>
                        </div>
                        <div class="item" id="codediv">
                            <div class="label"><i>*</i>验证码：</div>
                            <div class="input" style="position: relative">
                                <input type="text" id="code" value="" maxlength="6" onkeyup="this.value=this.value.replace(/^\s+|\s+$/g,'')" oninput="value=value.replace(/[^\d]/g,'')">
                                <input type="button" id="getcode" onclick="checkEdit()" value="获取验证码"
                                       style="width: 45%;display: inline;font-size: 13px;position: absolute;top: 6px;color:#fd7400;right: -12px;border: none;background: none;cursor:pointer;">
                            </div>
                        </div>
                        <!--<input type="submit" id="next" onclick="checkEdit()" value="下一步">-->
                        <input type="submit" id="show" onclick="ActSure()" value="确认" style="margin-left: 141px;">
                    </form>
                </div>
            </div>
        </div>
        <div class="clear"></div>
    </div>
</div>
{include file="public/foot" /}
</body>
{include file="public/load_bottom" /}
<script>
    $(function () {
        var is_check = "{$data.is_check}";
        if(is_check!=1){
            layer.alert('请先完成实名认证',function(){
                window.location.href = "{:url('Member/authentication')}";
            });
        }

        if("{:input('get.add')}"){
            $('#pagemain').hide()
            $('.edit').show()
        }

        // 点击编辑资料
        $('.bj').click(function(){
            $('#pagemain').hide()
            $('.edit').show()
        })
    })
    var count = 60;
    function GetYsCode() {
        var val = $('#getcode');
        if (count == 0) {
            val.css({
                'font-size': '13px',
                'right': '-12px'
            });
            val.attr('disabled', false);
            val.val('获取验证码');
            count = 60;
        } else {
            val.css({
                'font-size': '16px',
                'right': '-26px'
            });
            val.attr('disabled', true)
            val.val(count + "s");
            count--;
            setTimeout(function () {
                GetYsCode()
            }, 1000)
        }
    }
    function checkEdit() {
        var bank_number = $("#bank_number").val();
        var bank_truename=$("#bank_truename").val();
        var bank_mobile = $("#bank_mobile").val();
        var cardType = $("#cardType").val();
        var validate = $("#validate").val();
        var cvv2 = $("#cvv2").val();
        var phoneReg = /(^1[3|4|5|6|7|8|9]\d{9}$)|(^09\d{8}$)/;
        var nameReg = /^([\u4e00-\u9fa5]{1,10})(·|·([\u4e00-\u9fa5]*·)|)[\u4e00-\u9fa5]{1,10}$/;
        var bankReg = /((^\d{16})|(^\d{17})|(^\d{18})|(^\d{19}))$/;
        var cvv2Reg=/^\d{3}$/;
        var valiReg=/^\d{4}$/;

        if(bank_number == ''){
            layer.msg('请输入银行卡号');
            return false;
        }
        if(!nameReg.test(bank_truename)){
            layer.msg('姓名异常请联系客服',{time:1000});
            return false;
        }
//        if(!bankReg.test(bank_number)){
//            layer.msg('请输入正确银行卡号',{time:1000});
//            return false;
//        }
        if(!phoneReg.test(bank_mobile)){
            layer.msg('请输入正确手机号',{time:1000});
            return false;
        }
        if(bank_mobile == ''){
            layer.msg('请输入手机号');
            return false;
        }
        if(cardType == 2){
            if(!cvv2Reg.test(cvv2)){
                layer.msg('请输入正确CVV2',{time:1000});
                return false;
            }
            if(!valiReg.test(validate)){
                layer.msg('请输入正确有效期',{time:1000});
                return false;
            }

            if(validate == ''){
                layer.msg('请输入有效期');
                return false;
            }
            if(cvv2 == ''){
                layer.msg('请输入CVV2');
                return false;
            }
        }
        if(bank_mobile == ''){
            layer.msg('请输入手机号');
            return false;
        }
        GetYsCode();
        var index = layer.load(0, {shade: false});
        var FromData = $('#FromData').serialize();
        $.ajax({
            url: "{:url('Yun/addCard')}",
            type: "POST",
            dataType: "JSON",
            data: FromData,
            success: function(msg){
                layer.close(index);
                if(msg.status == 1){
                    $('#codediv').show();
                    $('#next').hide();
                    $("#show").attr('log',msg.info);
                    $('#show').show();
                    $("#cardType").attr('disabled',true);
                    $("#bank_number").attr('readonly',true);
                    $("#bank_mobile").attr('readonly',true);
                    $("#validate").attr('readonly',true);
                    $("#cvv2").attr('readonly',true);
                }else{
                    layer.msg(msg.info);
                }
            }
        })
    }

    function Sour(obj){
        var cardType = $(obj).val();
        if(cardType == 2){
            $('.xykinfo').show();
        }else{
            $('.xykinfo').hide();
        }
    }

    function ActSure(){
        var code = $("#code").val();
        var logid = $("#show").attr('log');
        if (code == '') {
            layer.msg("输入验证码");
            return false;
        } else if (code.length != 6) {
            layer.msg('请输入6位验证码');
            return false;
        } else if ($('#getcode').val() == '获取验证码') {
            layer.msg('请点击获取验证码');
            return false;
        }
        if (logid == '') {
            layer.msg("验证失败");
            return false;
        }
        if(logid == ''){
            layer.msg("验证失败");
            return false;
        }
        var index = layer.load(0, {shade: false});
        $.ajax({
            url: "{:url('Yun/actCard')}",
            type: "POST",
            dataType: "JSON",
            data: {id:logid,code:code},
            success: function(msg){
                layer.close(index);
                if(msg.status == 1){
                    layer.msg(msg.info);
                    window.location.href = msg.url;
                }else{
                    layer.confirm(msg.info, {
                        btn: ['重新输入'] //按钮
                    }, function(){
                        window.location.href = "{:url('Member/card')}"+'?add=1';
                    }, function(){
                        //
                    });
                }
            }
        })
    }


    function QianYUe(){
        var index = layer.load(0, {shade: false});
        $.ajax({
            url: "{:url('Yun/QianYue')}",
            type: "POST",
            dataType: "JSON",
            data: {},
            success: function(msg){
                layer.close(index);
                layer.msg(msg.info);
                if(msg.status == 1){
                    window.location.href = msg.url;
                }
            }
        })
    }

    function ToDel(id){
        layer.confirm('确认删除银行卡？！', {
            btn: ['确认','取消'] //按钮
        }, function(){
            var index = layer.load(0, {shade: false});
            $.ajax({
                url:"{:url('Yun/delCard')}",
                type: "POST",
                dataType: "JSON",
                data:{id:id},
                success:function(msg){
                    layer.close(index);
                    layer.msg(msg.info);
                    if(msg.status == 1){
                        window.location.href = msg.url;
                    }
                }
            })
        }, function(){

        });
    }
</script>
</html>
